import React, { useEffect, useRef } from 'react'
import * as echarts from 'echarts';

function Quantity() {
    const ref = useRef();
    useEffect(() => {
        var chartDom = ref.current;
        var myChart = echarts.init(chartDom);
        var option;

        option = {
            xAxis: {
                type: 'category',
                data: ['0.00', '2.00', '4.00', '8.00', '10.00', '12.00', '14.00', '16.00', '18.00', '20.00', '22.00', '24.00']
            },
            yAxis: {
                type: 'value'
            },
            grid: {
                left: '3%',
                right: '4%',
                top: '15%',
                containLabel: true
            },
            series: [
                {
                    data: [150, 230, 224, 218, 135, 147, 260,235,132,176,123.233,214,187],
                    type: 'line'
                }
            ]
        };

        option && myChart.setOption(option);

    }, [])
    return (
        <div className="Quantity" ref={ref} style={{ width: '500px', height: '280px' }}>

        </div>
    )
}

export default Quantity
